<template>
    <div class="app-container">

        <SearchContent :queryParams="queryParams" @query="handleQuery" @reset="resetQuery">
            <el-col :span="6">
                <el-form-item label="诉讼编号:" prop="proceedCode">
                    <el-input v-model="queryParams.proceedCode" clearable placeholder="请输入诉讼编号"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="客户名称:" prop="customName">
                    <el-input v-model="queryParams.customName" clearable placeholder="请输入客户名称"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="创建时间:" prop="sendTime">
                <el-date-picker type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format='yyyy-MM-dd'
                    style="width: 100%;" v-model="timeRange"  @change="changeTime">
                </el-date-picker>
            </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="诉讼进度:" prop="proceedStatus">
                    <el-select v-model="queryParams.proceedStatus" clearable>
                        <el-option :key="item.value" :label="item.label" :value="item.value"
                            v-for="item in dict.type.progress_litigation"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

        </SearchContent>

        <div class="card-wrap paddingAll20" :model="queryParams" label-width="86px">
            <div class="table-title-wrap justify-end">
                <el-button type="primary" size="mini" @click="handleAdd"
                           v-hasPermi="['purchaseManage:purchaseList:add']">新增
                </el-button>
            </div>
            <table-page :loading="loading" :dataList="dataList" :total="total" :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize" @setSizeCurrent="getList" border>
                <!-- 操作插槽 -->
                <template slot="tableColAc">
                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180px">
                        <template v-slot="{ row }">
                            <e-button size="mini" type="text" @click="handleOperate(row,1)"
                                v-hasPermi="['collectionManagement:litigationApplication:see']">查看
                            </e-button>
                            <e-button size="mini"  v-if="row.changeState==true" type="text" @click="handleOperate(row,2)"
                                v-hasPermi="['collectionManagement:litigationApplication:chaneg']">变更诉讼
                            </e-button>
                            <e-button size="mini" v-if="row.revokeState==0" type="text" @click="handleOperate(row,3)"
                                v-hasPermi="['collectionManagement:litigationApplication:revoke']">撤销诉讼
                            </e-button>
                            <e-button size="mini" v-if="row.againChangeState==true" type="text" @click="handleOperate(row,4)"
                                v-hasPermi="['collectionManagement:litigationApplication:changeAgen']">重新发起变更
                            </e-button>
                            <e-button size="mini" type="text" @click="handleOperate(row,5)" v-if="row.revokeState==1"
                                v-hasPermi="['collectionManagement:litigationApplication:changeRevoke']">重新发起撤销
                            </e-button>
                            <e-button size="mini" type="text" @click="handleOperate(row,6)" v-if="row.proceedStatus==1"
                                v-hasPermi="['collectionManagement:litigationApplication:addAgain']">重新发起诉讼
                            </e-button>
                        </template>
                    </el-table-column>
                </template>
                <!-- 普通列插槽 -->
                <template slot="tableCol">
                    <el-table-column label="诉讼编号" align="center" prop="proceedCode" 
                        show-overflow-tooltip />
                    <el-table-column label="客户名称" align="center" prop="customName" 
                        show-overflow-tooltip />
                    <el-table-column label="发起人" align="center" prop="createBy" 
                        show-overflow-tooltip />
                    <el-table-column label="审批状态" align="center" prop="proceedAuditStatus" 
                        show-overflow-tooltip >
                        <template  v-slot="{ row }">
                            <span v-if="row.proceedAuditStatus">{{ row.proceedAuditStatus }}</span>
                            <span v-else>-</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="诉讼进度" align="center" prop="proceedStatus" 
                        show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.progress_litigation" :value="row.proceedStatus" />
                        </template>
                    </el-table-column>
                    <el-table-column label="创建时间" align="center" prop="createTime"
                        show-overflow-tooltip />
                </template>
            </table-page>

        </div>
        <el-dialog :title="reissueTitle" :visible.sync="reissueOpen"  :close-on-click-modal="false" width="50%">
            <el-table :data="reissueDataList" border>   
                    <el-table-column label="诉讼变更编号" align="center" prop="proceedChangeCode" 
                        show-overflow-tooltip />
                    <el-table-column label="变更原因" align="center" prop="changeReason" 
                        show-overflow-tooltip />
                    <el-table-column label="提交人" align="center" prop="createBy" 
                        show-overflow-tooltip />
                    <el-table-column label="提交时间" align="center" prop="createTime" 
                        show-overflow-tooltip />
                    <el-table-column label="操作" align="center">
                        <template v-slot="{ row }">
                            <e-button size="mini" type="text" @click="reissueOperate(row)">选择
                            </e-button>
                        </template>
                    </el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>

<script>
import SearchContent from "@/components/SearchContent/index.vue";
import * as apis from "@/api/collectionManagement/litigationApplication.js";
export default {
    name: "LitigationApplication",
    components: {
        SearchContent,
    },
    dicts: ['progress_litigation'],
    data() {
        return {
            // 遮罩层
            loading: false,
            retutnCarTimes: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                vinNo: null,
            },
            total: 0,
            dataList: [],
            title: '查看',
            form: {
                type: '',
                paramName: '',
            },
            reissueOpen:false,
            reissueDataList:[
              
            ],
            timeRange : [],
            type:null,
            reissueTitle:'',
        };
    },
    mounted() {
        this.getList()
    },
    activated() {
        this.handleQuery()
    },
    methods: {
         // 创建时间发生改变
        changeTime(val) {
        this.queryParams.startTime = val[0]
        this.queryParams.endTime = val[1]
        },
         // 新增诉讼
         handleAdd(){
            this.$router.push({name:'AddLitigation'})
        },
        /** 查询列表 */
        getList() {
            this.loading = true
            apis.litigationLitigation(this.queryParams).then(res => {
                this.dataList = res.rows;
                this.total = res.total;
                this.loading = false
            }).finally(() => {
                this.loading = false
            })
        },

        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },

        /** 重置按钮操作 */
        resetQuery() {
            this.queryParams = {
                pageNum: 1,
                pageSize: 10,
                vinNo: null,
            },
            this.timeRange = []
            this.handleQuery();
        },


        handleOperate(row,type) {
            this.type = type
            if(type==1){
                this.$router.push({name: 'IitigationApplicationinfo',query:{id:row.id}})
            }else if(type==2){
                this.$router.push({name: 'Change',query:{id:row.id}})
            }else if(type==3){
                this.$router.push({name: 'Revoke',query:{id:row.id}})
            }else if(type==4){
                this.reissueTitle = '重新发起变更'
                this.reissueOpen =true
                // 有数据后打开这个接口,弹框数据会带在列表里面
                this.reissueDataList = row.proceedChangeVoList
            }else if(type==5){
                this.$router.push({name: 'Revoke',query:{id:row.id}})
            }else if(type==6){
                this.$router.push({name: 'AddAgainLitigation',query:{id:row.id}})
            }
        },
        reissueOperate(row){
            this.reissueOpen =false
            this.$router.push({name: 'RedoCollection',query:{id:row.id,type:this.type,}})
        }
        
    }
};
</script>
